﻿[query] {
    display: flex;
    margin: 2.4vw 4.4vw;
}

    [query] > div {
        display: flex;
        height: 10vw;
        border-radius: 0.4vw;
    }

        [query] > div:nth-child(1) {
            flex: 1;
            background-color: #FAFAFA;
            border: 2px solid #EBEBEB;
        }

            [query] > div:nth-child(1) > div:nth-child(1) {
                flex: 1;
            }

                [query] > div:nth-child(1) > div:nth-child(1) > input {
                    padding: 0 0 0 2.8vw;
                    border: none;
                    border-left: 2px solid #EBEBEB;
                    font-size: 3.6vw;
                }

            [query] > div:nth-child(1) > div:nth-child(2) {
                width: 10vw;
                margin: 2vw 0;
                border-left: 0.2vw solid #F0F0F0;
            }

                [query] > div:nth-child(1) > div:nth-child(2) > img {
                    width: 3.6vw;
                }

        [query] > div:nth-child(2) {
            width: 10vw;
            margin: 0 0 0 2.4vw;
        }

            [query] > div:nth-child(2) > img {
                width: 4.4vw;
            }

[bar] {
    background-color: #FAFAFA;
    display: flex;
    margin: 3.6vw 0 0 0;
    height: 10.4vw;
    padding: 1.2vw 0;
    font-size: 3.6vw;
    color: #646464;
}

    [bar] > div {
        flex: 1;
    }

        [bar] > div > img {
            margin: 0 2.8vw 0 0;
            width: 6.4vw;
            height: 6.4vw;
        }

        [bar] > div:nth-child(n+2) {
            border-left: 0.3vw solid #F0F0F0;
        }



[group] {
    margin: 1.2vw 1.6vw 0 1.6vw;
    border-radius: 1.2vw;
    background-color: #FAFAFA;
}

    [group] > [group-title] {
        display: flex;
    }

        [group] > [group-title] > div:nth-child(1) {
            flex: 1;
            padding: 3.6vw 0 3.6vw 4vw;
            font-size: 4vw;
        }

        [group] > [group-title] > div:nth-child(2) {
            width: 15vw;
        }

    [group] > [group-item] {
        display: flex;
        margin: 1.2vw 1.6vw 0 1.6vw;
        padding: 1.2vw 0 1.2vw 5.6vw;
        background-color: #FAFAFA;
        border-radius: 0.4vw;
        border-top: 0.2vw solid #F0F0F0;
    }

        [group] > [group-item] > div:nth-child(1) {
            flex: 1;
            border-right: 0.3vw solid #F0F0F0;
        }

            [group] > [group-item] > div:nth-child(1) > div:nth-child(1) {
                margin: 2.2vw 0 0 0;
                color: #323232;
            }

            [group] > [group-item] > div:nth-child(1) > div:nth-child(2) {
                margin: 2vw 0;
                font-size: 2.4vw;
                color: #646464;
            }

        [group] > [group-item] > div:nth-child(2) {
            width: 16vw;
        }

            [group] > [group-item] > div:nth-child(2) > img {
                width: 10vw;
            }


[result] {
    display: flex;
    margin: 1.2vw 1.6vw 0 1.6vw;
    padding: 1.2vw 0 1.2vw 5.6vw;
    background-color: #FAFAFA;
    border-radius: 0.4vw;
}

    [result] > div:nth-child(1) {
        flex: 1;
        border-right: 0.3vw solid #F0F0F0;
    }

        [result] > div:nth-child(1) > div:nth-child(1) {
            margin: 2.2vw 0 0 0;
            color: #323232;
        }

        [result] > div:nth-child(1) > div:nth-child(2) {
            margin: 2vw 0;
            font-size: 2.4vw;
            color: #646464;
        }

    [result] > div:nth-child(2) {
        width: 16vw;
    }
